<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>秒表</title>
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
    <style type="text/css">
        .T{
            width: 300px;
            padding-left: 50%;
            position: relative;
            right: 150px;
        }
    </style>
</head>
<body>
<div class="T">
    <p style="width: 300px;text-align: center;font-size: 3em;">计时器</p>
    <div style="width: 300px;height:4em;line-height: 3em;text-align: center;">
        <span id="A" style="font-size: 3em;">00:00:00<small>:00</small></span>
    </div>
    <div style="width: 300px;text-align: center;">
        <button onclick="ss()">开始/暂停</button><button onclick="kl()">归零</button>
    </div>
</div>

</body>
<script>
    var a = document.getElementById('A');
    var hour = '00';
    var minute = '00';
    var second = '00';
    var Millisecond = '00';
    function js(){
        Millisecond++;
        if (Millisecond==99) {
            Millisecond = 0;
            if(++second==60){
                second = 0;
                if(++minute==60){
                    minute = 0;
                    hour++;
                }
            }
        }
        if(hour<10&&(hour+'').length==1){
            hour = '0'+ hour;
        }
        if(minute<10&&(minute+'').length==1){
            minute = '0' + minute;
        }
        if(second<10&&(second+'').length==1){
            second = '0' + second;
        }
        if(Millisecond<10&&(Millisecond+'').length==1){
            Millisecond = '0' + Millisecond;
        }
        a.innerHTML = hour + ':' + minute + ':' + second + '<small>:' + Millisecond + '</small>';
    }
    var x;
    var p = false;
    function ss(){
        if(!p){
            p = true;
            x = setInterval('js()',1);
        }else{
            p = false;
            clearInterval(x);
        }
    }
    function kl(){
        p = false;
        clearInterval(x);
        hour = '00';
        minute = '00';
        second = '00';
        Millisecond = '00';
        a.innerHTML = hour + ':' + minute + ':' + second + '<small>:' + Millisecond + '</small>';
    }
</script>
</html>